<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Eno Yao</title>
  </head>
  <body>
    <script src="https://tencent.github.io/omi/packages/omi/dist/omi.js"></script>
    <script>
      const { WeElement, define, html, h, render } = omi;
      const StyledComponents = styled.div`
        p {
          color: #58bc58;
        }
      `;

      class MyAbcAbc extends WeElement {
        render() {
          return h(StyledComponents, null, h("p", null, this.state.title));
        }

        constructor(props) {
          super(props);
          this.state.title = "Eno Yao";
        }
      }

      MyAbcAbc.css = `p{color:#58bc58}`;
      export default MyAbcAbc;
      render(
        html`
          <MyAbcAbc />
        `,
        "body"
      );
    </script>
  </body>
</html>
